To get a job as a front end developer, we need to nail the coding interview.
In this article, we’ll look at some object questions.
How to check if a certain property exists in an object?
There’re a few ways to check if a property exists in an object.
First, we can use the in
operator. For example, we can use it as follows:
const foo = { a: 1 };
console.log('a' in foo);
The in
operator checks if the property with the given name exists in the object itself or its prototypes in the prototype chain.
The code above should return true
since a
is a property of foo
.
console.log(‘toString’ in foo);
should also log true
since toString
is in the Object
‘s prototype, which foo
inherits from.
We can also use the Object.prototype.hasOwnProperty
method. For example, we can use it as follows:
const foo = { a: 1 };
console.log(foo.hasOwnProperty('a'));
The code above uses the hasOwnProperty
method in foo
‘s prototype to check if a
exists in foo
and its own property, which means that it’s in foo
itself rather than its prototype.
The console.log
logs true
since a
is foo
‘s own property.
Finally, we can check using the bracket notation as follows:
const foo = {
a: 1
};
console.log(foo['a']);
If it returns the value other than undefined
, then we know we added it as a property.
Since this is the case with our example, it should return true
.
What’s the difference between Object.seal
and Object.freeze
methods?
After calling Object.seal
on an object, we stop properties from being added to the object.
It also makes all existing properties non-configurable, which means the property descriptors are prevented from changing.
Existing properties also can’t be removed with the delete
operator after it’s called on an object.
The object’s __proto__
property, which is the object’s prototype, is also sealed.
For example, if we have:
const foo = {
a: 1
};
Object.seal(foo);
delete foo.a
We’ll still see foo.a
after we run the last line.
If we’re in strict mode, we’ll get an error.
Object.freeze
makes the object immutable. Existing properties can’t be changed in any way, including the values of each property.
It also does everything that Object.seal
does.
What’s the difference between the in
operator and the hasOwnProperty
method in objects?
The in
operator checks if a property is in the object itself and if it’s in its prototypes up the prototype chain.
On the other hand, hasOwnProperty
only checks if an object is inside the object that it’s called on and not any of its prototypes.
Why does typeof null
return object
?
null
has type object
because it’s how it acts in early versions of JavaScript. It just stays this way to prevent breaking existing codebases.
How to check if a value is null
?
We should use the strict equality operator to check for null
as follows:
foo === null
What does the new
keyword do?
The new
keyword is used to create an object from constructor functions or classes.
For example, if we have a Person
class:
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
};
Then we can create a new instance of it by writing:
const person = new Person("Jane", "Smith");
new
does a few things:
- It creates an empty object
- Assigns the empty object to the
this
value - The function inherits from the
prototype
property of the constructor function. SoPerson
inherits fromPerson.prototype
. - If there’s no
return
statement in the function, then it’ll returnthis
.
Note that the class syntax in ES2015 or later is just syntactic sugar for constructor functions. It does the same thing but looks like a class.
Conclusion
We can check if a property exists in an object with the in
operator, hasOwnProperty
, or bracket notation.
Object.seal
prevent property descriptors from changing and properties from being deleted.
Object.freeze
makes an object immutable.
null
is of type object
rather than having its own type.
The new
keyword makes a new object from a constructor function and returns it.